<!--
  * 数据源管理测试页面
  *
  * @Author:    1024创新实验室-主任：卓大
  * @Date:      2024-01-01 00:00:00
  * @Wechat:    zhuda1024
  * @Email:     lab1024@163.com
  * @Copyright  1024创新实验室 （ https://1024lab.net ），Since 2012
-->
<template>
  <div class="test-page">
    <h1>数据源管理功能测试</h1>
    
    <a-card title="常量测试" style="margin-bottom: 16px">
      <p>数据库类型枚举: {{ DATABASE_TYPE_ENUM.MYSQL.desc }}</p>
      <p>数据源状态枚举: {{ DATASOURCE_STATUS_ENUM.ENABLED.desc }}</p>
    </a-card>

    <a-card title="组件测试" style="margin-bottom: 16px">
      <a-space>
        <SmartEnumSelect
          v-model:value="testValue"
          enumName="DATABASE_TYPE_ENUM"
          placeholder="请选择数据库类型"
        />
        <SmartEnumLabel :enum-name="'DATABASE_TYPE_ENUM'" :value="testValue" />
      </a-space>
    </a-card>

    <a-card title="API测试">
      <a-space>
        <a-button @click="testApi">测试API</a-button>
        <a-button @click="goToList">跳转到数据源列表</a-button>
        <a-button @click="goToManager">跳转到数据库管理工具</a-button>
      </a-space>
    </a-card>
  </div>
</template>

<script setup>
  import { ref } from 'vue';
  import { useRouter } from 'vue-router';
  import { message } from 'ant-design-vue';
  import SmartEnumSelect from '/@/components/framework/smart-enum-select/index.vue';
  import SmartEnumLabel from '/@/components/support/smart-enum-label/index.vue';
  import { DATABASE_TYPE_ENUM, DATASOURCE_STATUS_ENUM } from '/@/constants';

  const router = useRouter();
  const testValue = ref('mysql');

  const testApi = async () => {
    try {
      message.success('API测试成功');
    } catch (error) {
      message.error('API测试失败');
    }
  };

  const goToList = () => {
    router.push('/datasource/list');
  };

  const goToManager = () => {
    router.push('/datasource/manager');
  };
</script>

<style scoped>
  .test-page {
    padding: 16px;
  }
</style> 